import { FC } from 'react';
import { Card, Button, Divider } from '@mui/material';
import book from '../../assets/book.webp';
import './index.less';

const ResourceCard: FC = () => {
  return (
    <Card variant="outlined" className='resource-card'>
      <div className='resource-desc'>
        <img src={ book } alt="" className='resource-img' />
        <div>
          <h3>钢铁是怎样练成的</h3>
          <p>叙述一个人顽强的意志力</p>
        </div>
      </div>
      <Divider />
      <div className='buttons'>
        <Button variant="text" className='button'>喜欢</Button>
        <Divider orientation="vertical" flexItem variant='middle' />
        <Button variant="text" className='button'>分享</Button>
        <Divider orientation="vertical" flexItem variant='middle' />
        <Button variant="text" className='button'>访问</Button>
      </div>
    </Card>
  );
};

export default ResourceCard;
